<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商场核查</title>
    <link rel="stylesheet" type="text/css" href="/webapp/css/easyui.css">
    <link rel="stylesheet" type="text/css" href="/webapp/css/icon.css">
    <link rel="stylesheet" type="text/css" href="/webapp/css/color.css">
    <link rel="stylesheet" type="text/css" href="/webapp/css/public.css">
    <script type="text/javascript" src="/webapp/js/lib/jquery.min.js"></script>
    <script type="text/javascript" src="/webapp/js/lib/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/webapp/js/lib/ajaxfileupload.js"></script>
    <script type="text/javascript" src="/webapp/js/common/config.js"></script>
</head>
<body>
<div class="easyui-container-fluid">
    <div class="easyui-panel" style="border:none;">
        <div class="nav" id="nav"></div>
        <div class="easyui-panel" style="border:none;">
            <form id="ff">
                <div style="margin-bottom:20px;">
                            <span>
                            <label class="item-label">年份：</label>
                            <input type="text" class="easyui-combobox" name="year" id="year" style="width:100px;"/>
                            </span>
                    <span id="monthLabel">
                            <label class="item-label">月份：</label>
                            <input type="text" class="easyui-combobox" name="month" id="month" style="width:100px;"/></span>
                    <span id="weekLabel">
                            <label class="item-label">周数：</label>
                            <input type="text" class="easyui-combobox" name="week" id="week" style="width:100px;"/></span>
                    <label class="item-label">品类：</label>
                    <select id="categorySelect" class="easyui-combobox" style="width:174px;" name="categories" data-options="multiple:true"></select>
                    <label class="item-label">渠道码：</label>
                    <input id="channelCodeMulti" name="channelCodeMulti" style="width:120px" data-options="
                                                        prompt: '多个渠道码请用逗号隔开'

                                                        " class="easyui-textbox">
                    <label class="item-label">商场码：</label>
                    <input id="mallCode" name="mallCodeMulti" style="width:120px" data-options="
                                                        prompt: '多个码请用逗号隔开'

                                                        " class="easyui-textbox">
                    <label class="item-label">记录数：</label>
                    <input id="recordCountQuery" class="easyui-switchbutton" checked style="width:60px;height:30px;" onText="ON" offText="OFF"  >
                    &nbsp;量：
                    <input id="countQuery" class="easyui-switchbutton" style="width:60px;height:30px;" onText="ON" offText="OFF"   >
                    &nbsp;额：
                    <input id="totalQuery" class="easyui-switchbutton" style="width:60px;height:30px;" onText="ON" offText="OFF"   >
                    <a href="javascript:void(0);" style="margin-left:40px;width:80px;" class="easyui-linkbutton c8" onclick="searchBy()">查询</a>
                </div>
            </form>
        </div>
        <div class="table-wrapper " >
            <table id="datagrid">
                <thead>
                <tr>
                    <th data-options="field:'categoryName',align:'center'" width="80">品类</th>
                    <th data-options="field:'channelCode',align:'center'" width="80">商场码</th>
                    <th data-options="field:'recordCount',align:'center',formatter:zeroReplace" width="100"><span style='color: red'>本月/周(条)</span></th>
                    <th data-options="field:'recordCount1',align:'center',formatter:zeroReplace" width="100"><span style='color: red'>-1月/周</span></th>
                    <th data-options="field:'recordCount2',align:'center',formatter:zeroReplace" width="100"><span style='color: red'>-2月/周</span></th>
                    <th data-options="field:'recordCount3',align:'center',formatter:zeroReplace" width="100"><span style='color: red'>-3月/周</span></th>
                    <!--<th data-options="field:'recordCount4',align:'center',formatter:zeroReplace" width="100"><span style='color: red'>-4月/周</span></th>-->
                    <th data-options="field:'count',align:'center',formatter:zeroReplace" width="100"><span style='color: green'>本月/周(量)</span></th>
                    <th data-options="field:'count1',align:'center',formatter:zeroReplace" width="100"><span style='color: green'>-1月/周</span></th>
                    <th data-options="field:'count2',align:'center',formatter:zeroReplace" width="100"><span style='color: green'>-2月/周</span></th>
                    <th data-options="field:'count3',align:'center',formatter:zeroReplace" width="100"><span style='color: green'>-3月/周</span></th>
                    <!--<th data-options="field:'count4',align:'center',formatter:zeroReplace" width="100"><span style='color: green'>-4月/周</span></th>-->
                    <th data-options="field:'total',align:'center',formatter:zeroReplace" width="100">本月/周(额)</th>
                    <th data-options="field:'total1',align:'center',formatter:zeroReplace" width="100">-1月/周</th>
                    <th data-options="field:'total2',align:'center',formatter:zeroReplace" width="100">-2月/周</th>
                    <th data-options="field:'total3',align:'center',formatter:zeroReplace" width="100">-3月/周</th>
                    <!--<th data-options="field:'total4',align:'center',formatter:zeroReplace" width="100">-4月/周</th>-->
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function () {
        setNav();
        // initCategoryMultiple();
        initCategorySelect("categorySelect")
        initMonthWeek("monthLabel", "weekLabel");
        $('#channelCodeMulti').textbox({
            icons: [{
                iconCls: 'icon-clear', handler: function (e) {
                    $(e.data.target).textbox('clear');
                }
            }]
        });
        var height = $(window).height();
        var ff_height = $("#ff").height();
        var table_height = height - ff_height - 60;
        $("#datagrid").css("max-height", table_height);
        $("#datagrid").datagrid({
            rownumbers: true,
            // pagination: true,
            singleSelect: true,     //是否单选
            idField: "id",
            checkOnSelect: false,
            fitColumns:true,    //自动适应分辨率
            scrollbarSize:0     //滚动条大小
        }).datagrid("getPager").pagination({
            onSelectPage: searchBy
        });
    });

    function searchBy(){
        var data = getFormData(document.getElementById("ff"));
        data.mallCodeMulti=$("#mallCode").val();
        data.channelCodeMulti=$("#channelCodeMulti").val();
        data.reportType=window.parent.workMode.toUpperCase();
        data.reportType=window.parent.workMode.toUpperCase();
        data.recordCount = $("#recordCountQuery").switchbutton("options").checked;
        data.count = $("#countQuery").switchbutton("options").checked;
        data.total = $("#totalQuery").switchbutton("options").checked;
        data.categoryCodes = $("#categorySelect").combotree("getValues").toString();
        $.ajax({
            type:"get",
            url:config.url + "/categoryMiss/mallaudit",
            data:transfer(data),
            dataType: "json",
            xhrFields:{withCredentials:true},
            beforeSend:function () {
                $.messager.progress({
                    title:"请稍等",
                    interval:50,
                    text:"数据加载中..."
                });
            },
            success:function(data){
                $.messager.progress("close");
                if (data.code == 200) {
                    $("#datagrid").datagrid("loadData", data.msg.content);
                }else {
                    $.messager.alert("提示", data.msg, "error");
                }
            },
            error:function(data){
                $.messager.progress("close");
            }
        });
    }

    function zeroReplace(val,row) {
        if (val == 0) {
            return "";
        }else {
            return val;
        }
    }

    function initCategoryMultiple() {
        var dtd = $.Deferred();
        $.ajax({
            url:config.url +"/category/getAll",
            type:"get",
            xhrFields:{withCredentials:true},
            success:function (data) {
                if(data){
                    var content=[];
                    for (let i = 0; i < data.length; i++) {
                        content[i] = {"id": data[i].code, "text": data[i].name};
                    }
                    $("#categorySelect").combotree({
                        valueField: "id",
                        textField: "text",
                        panelHeight:150,
                        prompt: "--请选择--",
                        multiple: true,
                        data:content,
                    });
                }
                dtd.resolve();
            },
            error:function(XMLHttpRequest,textStatus,errorThrown){
                dtd.resolve();
            }
        })
        return dtd.promise();
    }
</script>
</html>